{#foreach $T.records as record}
	<div class="record-element" data-id="{$T.record$key}">
		<div class="record-display">
			<span class="lw-data lw-category" data-value="{$T.record.category}" {commons.attributes.category}="{getCategoryName($T.record.category).toLowerCase()}"></span>
			{#if getCategoryIcon($T.record.category) != "none"}
				<img src="images/icons/{getCategoryIcon($T.record.category)}" alt="{getCategoryName($T.record.category)}" title="{getCategoryName($T.record.category)}" />
			{#/if}
			<span class="lw-data lw-date" data-time="{$T.record.date}" title="{new Date($T.record.date).toString()}">{transformTime($T.record.date)}</span>
			<span class="lw-data lw-desc">{$T.record.description}</span>
			<span  class="lw-data lw-amount" {commons.attributes.amount}="{$T.record.amount}">{$T.record.amount}</span>
			<a href="javascript:void()" title="edit" class="lw-btn lw-mini-btn edit-btn">
				<span>&nbsp;</span>
			</a>
			<a href="javascript:void()" title="delete" class="lw-btn lw-mini-btn delete-btn">
				<span>&nbsp;</span>
			</a>
		</div>
		<div class="record-edit">
		</div>
	</div> 
{#/for}
<div id="editControls" style="display:none">
	{#include inn}
</div>